import React,{Suspense, useEffect} from "react";
import {useRoutes} from "react-router-dom";

import routes from "@/router/index.tsx";
import AppHeader from "./components/app-header";
import AppFooter from "./components/app-footer";
import AppPlayerBar from "./views/player/app-player-bar";
import { useAppDispatch } from "./store";
import { fetchCurrentSongAction } from "./views/player/store";


function App() {
    const dispatch = useAppDispatch();
    useEffect(()=>{
        dispatch(fetchCurrentSongAction(2661822341));
    },[]);
    return (
        <div className="App">
            <AppHeader></AppHeader>
            <Suspense fallback="">
                <div className="main">{useRoutes(routes)}</div>
            </Suspense>
            <AppFooter></AppFooter>
            {/* 音乐播放器 */}
            <AppPlayerBar></AppPlayerBar>
        </div>
    )
}

export default App;
